/*
 * @Author: Dorange.Wang
 * @Date: 2021-06-21 15:46:27
 * @LastEditors: your name
 * @LastEditTime: 2021-06-28 16:59:51
 * @Description: file content
 */
import BaseRenderer from 'diagram-js/lib/draw/BaseRenderer'
import { getCustomElementConfig } from '../../utils/util'
// import './iconfont.js'
import {
  append as svgAppend,
  create as svgCreate,
  classes as svgClass
} from 'tiny-svg'

const HIGH_PRIORITY = 1500
export default class CustomRenderer extends BaseRenderer {
  constructor (eventBus, bpmnRenderer) {
    super(eventBus, HIGH_PRIORITY)
    this.bpmnRenderer = bpmnRenderer
  }

  canRender (element) {
    return !element.labelTarget
  }

  drawShape (parentNode, element) {
    const shape = this.bpmnRenderer.drawShape(parentNode, element)
    const config = getCustomElementConfig(element)
    if (config) {
      svgClass(parentNode).add('custom-svg-element')
      if (config.bgStyle) {
        const customBg = svgCreate('circle', {
          ...config.bgStyle
        })
        svgAppend(parentNode, customBg)
      }

      const iconSymbol = svgCreate('use', {
        href: '#hanma-bpmn-icon' + config.icon?.replace('el-icon', ''),
        ...config.style
      })
      svgAppend(parentNode, iconSymbol)
    }
    return shape
  }

  getShapePath (shape) {
    return this.bpmnRenderer.getShapePath(shape)
  }
}

CustomRenderer.$inject = ['eventBus', 'bpmnRenderer']
